<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
	<title>事务设置</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link href="<%=basePath%>assets/css/dpl-min.css" rel="stylesheet" type="text/css" />
	<link href="<%=basePath%>assets/css/bui-min.css" rel="stylesheet" type="text/css" />
	<link href="<%=basePath%>assets/css/page-min.css" rel="stylesheet" type="text/css" />
	<link href="<%=basePath%>assets/css/prettify.css" rel="stylesheet" type="text/css" />
	<script language="javascript" src="<%=basePath%>assets/js/js.js"></script>
	<script type="text/javascript" src="<%=basePath%>assets/js/jquery-1.8.1.min.js"></script>
	<script type="text/javascript" src="<%=basePath%>assets/js/bui-min.js"></script>
	<script type="text/javascript" src="<%=basePath%>assets/js/config-min.js"></script>
	<script src="http://g.tbcdn.cn/fi/bui/jquery-1.8.1.min.js"></script>
	<script src="http://g.alicdn.com/bui/seajs/2.3.0/sea.js"></script>
	<script src="http://g.alicdn.com/bui/bui/1.1.21/config.js"></script>
	<link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/dpl.css" rel="stylesheet">
	<link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/bui.css" rel="stylesheet">
	
	<style type="text/css">
		body {
			text-align: center;
			padding: 20px 50px 20px 30px;
		}
		
		.doc-content {
			width: 100%;
		}
		
		.doc-content .container #J_Form3 {
			width: 100%;
		}
		
		.form-panel {
			width: 100%;
		}
		
		.panel-content, .tabletop th {
			background: #D9EDF7;
		}
		
		.panel-content>li>button, .panel-content>li>a {
			font-size: 12px;
			letter-spacing: 2px;
			margin-left: 20px;
		}
		
		.textarea {
			width: 98%;
			height: 80px;
			resize: none;
			overflow: scroll;
			overflow-x: hidden;
		}
		
		.container {
			width: 100%;
		}
		
		.container .row {
			width: 100%;
		}
		
		.container .row .btn {
			display: inline-block;
			width: 92%;
		}
		
		#tablebottom {
			background: #fff;
			margin-left: 0px;
		}
		
		#tablebottom table {
			margin-top: 20px;
		}
		
		#tablebottom table th {
			background: #D9EDF7;
		}
		
		#tablebottom table th, #tablebottom table td {
			text-align: center;
		}
	</style>
</head>
<body>
	<!-- 界面上方的按钮组 -->
	<div class="container">
		<div class="row">
			<div class="well btn" style="background: #D9EDF7;">
				<%-- 根据角色动态增加按钮组 --%>
				<s:iterator value="#session.userInfo.groups" var="group">
					
					<%-- 加载网点的按钮 --%>
					<!-- 类型111对应网点 -->
					<s:if test="group.type == 111">
						<!-- 如果事务已经进入待办结状态，生成办结按钮 -->
						<s:if test="#transaction.tstate == 4">
							<a id="endTrans" href="#" class="button button-info">办结</a>
						</s:if>
						
						<!-- 如果事务在待处理状态，生成催办按钮 -->
						<s:if test="#transaction.tstate == 3">
							<a id="pressTrans" href="#" class="button button-info">催办</a>
						</s:if>
						
						<!-- 如果事务在待审核响应或者待审核状态，并且上报人是自己，可以回收 -->
						<s:if test="#transaction.tstate == 0 || #transaction.tstate == 1 && #transaction.userid == ##session.userInfo.user.firstName">
							<a id="returnTrans" href="#" class="button button-info">回收</a>
						</s:if>
					</s:if>
					

					<%-- 加载网管中心的按钮 --%>
					<!-- 类型4对应网管中心 -->
					<s:if test="group.type == 4">
						<!-- 如果事务在待审核响应或者待响应状态时生成响应按钮 -->
						<s:if test="#transaction.tstate == 0 || #transaction.tstate == 2">
							<a id="responseTrans" href="#" class="button button-info">响应</a> 
						</s:if>
						
						<!-- 如果事务状态为待审核，生成驳回按钮 -->
						<s:if test="#transaction.tstate == 1">
							<a id="refuseTrans" href="#" class="button button-info">驳回</a>
						</s:if>
						
						<!-- 如果事务已经进入待办结状态，生成办结按钮 -->
						<s:if test="#transaction.tstate == 4">
							<a id="endTrans" href="#" class="button button-info">办结</a>
						</s:if>
						
						<!-- 如果事务在待处理状态，生成催办按钮 -->
						<s:if test="#transaction.tstate == 3">
							<a id="pressTrans" href="#" class="button button-info">催办</a>
						</s:if>
						
						<!-- 如果事务在待审核响应或者待审核状态，并且上报人是自己，可以回收 -->
						<s:if test="#transaction.tstate == 0 || #transaction.tstate == 1 && #transaction.userid == ##session.userInfo.user.firstName">
							<a id="returnTrans" href="#" class="button button-info">回收</a>
						</s:if>
						
						<!-- 审批通过但未进入待办结的事务可以提交行长 -->
						<s:if test="#transaction.tstate >= 2 && #transaction.tstate <= 3">
							<a id="forwardPresident" href="#" class="button button-info">提交行长</a>
						</s:if>
						
						<!-- 待处理的事务生成处理按钮 -->
						<s:if test="#transaction.tstate == 3">
							<a id="handleTrans" href="#" class="button button-info">处理</a>
						</s:if>
						
						<!-- 如果发来的是延期申请，生成延期按钮 -->
						<s:if test="#option = delay">
							<a id="delayJudge" href="#" class="button button-info">延期审批</a>
						</s:if>
					</s:if>
					

					<%-- 加载职能部门按钮 --%>
					<!-- 类型11对应职能部门 -->
					<s:if test="group.type == 11">
						<!-- 如果事务在待响应状态时生成响应按钮 -->
						<s:if test="#transaction.tstate == 2">
							<a id="responseTrans" href="#" class="button button-info">响应</a> 
						</s:if>
						
						<!-- 部门对于所有相关事务都可以发表意见 -->
						<a id="commentTrans" href="#" class="button button-info">发表意见</a>
						
						<!-- 待处理的事务生成处理按钮 -->
						<s:if test="#transaction.tstate == 3">
							<a id="handleTrans" href="#" class="button button-info">处理</a>
						</s:if>
						
						<!-- 如果事务已经进入待办结状态，生成办结按钮 -->
						<s:if test="#transaction.tstate == 4">
							<a id="endTrans" href="#" class="button button-info">办结</a>
						</s:if>
						
						<!-- 如果事务在待审核响应或者待审核状态，并且上报人是自己，可以回收 -->
						<s:if test="#transaction.tstate == 0 || #transaction.tstate == 1 && #transaction.userid == ##session.userInfo.user.firstName">
							<a id="returnTrans" href="#" class="button button-info">回收</a>
						</s:if>
						
						<!-- 事务在待处理状态生成转发按钮 -->
						<s:if test="#transaction.tstate == 3">
							<a id="forwardTrans" href="#" class="button button-info">转发</a>
						</s:if>
						
						<!-- 事务在待处理阶段，并且要执行的是延期操作，可以生成延期按钮 -->
						<s:if test="#option = delay && #transaction.tstate == 3">
							<a id="delayPost" href="#" class="button button-info">延期</a> 
						</s:if>
						
					</s:if>
					
					<%-- 加载行长按钮 --%>
					<!-- 类型3对应行长 -->
					<s:if test="group.type == 3">
						<!-- 行长对审核通过但没有进入待办结状态事务都可以批示和发表意见 -->
						<s:if test="#transaction.tstate >= 2 && #transaction.tstate <= 3">
							<a id="markerTrans" href="#" class="button button-info">批示</a>
							<a id="commentTrans" href="#" class="button button-info">发表意见</a>
							<a id="pressTrans" href="#" class="button button-info">催办</a>
						</s:if>
					</s:if>
				</s:iterator>
				
				<%-- 加载公共按钮 --%>
				<input type="button" class="button" value="返 回"
					onclick="<%= basePath %>" /> 
				<span id="info"></span>
			</div>
		</div>
	</div>

	<%-- 从数据库加载出来的事务详情表格 --%>
	<table class="table table-bordered tabletop">
		<tr>
			<th style="text-align: right;">当前处理部门</th>
			<th>
				<%-- 说明，UserInfo类没有baseGroup这个属性，但是有getBaseGroup方法，
					能够得到Group对象，通过Group可以拿到name属性，也就是除公告员之外的部门名称
					用户登陆后会在session中存一个UserInfo类对象，可以通过它获得想要的信息
				 --%>
				<s:property value="#session.userInfo.baseGroup.name"/>
			</th>
			
			<th style="text-align: right;">当前所处状态</th>
			<th>
				<%-- 根据状态的不同取不同的值 --%>
				<s:if test="#transaction.tstate == -2">已终止</s:if>
				<s:elseif test="#transaction.tstate == -1">已回收</s:elseif>
				<s:elseif test="#transaction.tstate == 0">待初审响应</s:elseif>
				<s:elseif test="#transaction.tstate == 1">待审核</s:elseif>
				<s:elseif test="#transaction.tstate == 2">待处理响应</s:elseif>
				<s:elseif test="#transaction.tstate == 3">待处理</s:elseif>
				<s:elseif test="#transaction.tstate == 4">待办结</s:elseif>
				<s:elseif test="#transaction.tstate == 5">已办结</s:elseif>
				<s:else>未知</s:else>
			</th>
			
			<th style="text-align: right;">是否提交行长</th>
			<th>
				<s:if test="#transaction.tpresident == 1">是</s:if>
				<s:else>否</s:else>
			</th>
		</tr>

		<tr>
			<td align="right">事务种类</td>
			<td>
				<s:property value="#transaction.ttname"/>
			</td>
			
			<td align="right">事务明细</td>
			<td colspan="3">
				<s:property value="#transaction.tdname"/>
			</td>
		</tr>

		<tr>
			<%-- 事务明细的信息，需要从事务明细里面加载 --%>
			<td align="right">服务保障级别</td>
			<td>
				<s:if test="#transDetail.dlevel == 0">无</s:if>
				<s:elseif test="#transDetail.dlevel == 1">一级</s:elseif>
				<s:else>二级</s:else>
			</td>
			
			<td align="right">是否初审</td>
			<td>
				<%--由于需求中没有提到要审核多次，所以只靠状态来判断 --%>
				<s:if test="#transaction.tstate == 0">否</s:if>
				<s:else>是</s:else>
			</td>
			
			<%-- 需求处理部门也就是事务中的当前处理部门字段的值，而不是登录的用户信息中的部门 --%>
			<td align="right">需求处理部门</td>
			<td>
				<s:property value="#transaction.currentdept"/>
			</td>
		</tr>
		
		<tr>
			<%-- 从事务明细中加载 --%>
			<td align="right">服务响应时间</td>
			<td>
				<s:property value="#transDetail.examtime"/>工时
			</td>
			
			<td align="right">服务解决时限</td>
			<td>
				<s:property value="#transDetail.endtime"/>
			</td>
			
			<td align="right">超 时</td>
			<td>
				<%-- 如果超时了，显示红色字体 --%>
				<s:if test="#transaction.ttimeout >= #nowdate">
					<font color="red">
						<s:date name="#transaction.ttimeout" 
							format="yyyy年MM月dd日 HH:mm:ss"/>
					</font>
				</s:if>
				<%-- 否则按正常字体显示 --%>
				<s:else>
					<s:date name="#transaction.ttimeout" 
							format="yyyy年MM月dd日 HH:mm:ss"/>
				</s:else>
			</td>
		</tr>
		
		<tr>
			<%-- 从事务明细加载 --%>
			<td align="right">事务备注</td>
			<td colspan="5">
				<s:property value="#transDetail.note"/>
			</td>
		</tr>
		<tr>
			<td align="right">需求事项描述</td>
			<td colspan="5">需求解决事项的现状、数量、缓急程度等</td>
		</tr>
		<tr>
			<td align="right">上报单位</td>
			<td>
				<s:property value="#transaction.tdeptname"/>
			</td>
			
			<td align="right">上报人</td>
			<td>
				<s:property value="#transaction.username"/>
			</td>
			<td align="right">上报人联系电话</td>
			<td>
				<s:property value="#transaction.tphone"/>
			</td>
		</tr>
		<tr>
			<td align="right">上报时间</td>
			<td>
				<s:date name="#transaction.tsubmittime" format="yyyy-MM-dd HH:mm:ss"/>
			</td>
			
			<td align="right">催 办</td>
			<td>
				<s:property value="#transaction.turge"/>次
			</td>
			<td align="right">&nbsp;</td>
			<td>&nbsp;</td>
		</tr>
		<tr>
			<!-- 从批注表加载出来的批注 -->
			<td align="right" valign="top">事务处理过程</td>
			<td colspan="5">
				<s:iterator value="#relatedCommentList" var="comment">
					<p>
						<textarea name="textarea" class="textarea" rows="4"
							readonly="readonly">
							<s:property value="#comment.type"/>
							：
							<s:property value="#comment.fullMessage"/>
							<br/><br/>
							<s:date name="#comment.time" format="yyyy-MM-dd HH:mm:ss"/>
			            </textarea>
					</p>
				</s:iterator>
			</td>
		</tr>

	</table>

	<!-- 子任务列表 -->
	<div id="tablebottom" class="row tablerow well">
		<table class="table table-bordered">
			<tr>
				<th colspan="6">任务列表</th>
			</tr>
			<tr>
				<th>序号</th>
				<th>任务描述</th>
				<th>任务类型</th>
				<th>处理部门</th>
				<th>当前状态</th>
				<th>处理时间</th>
			</tr>
			<s:iterator value="relatedTaskList" var="task" status="st">
				<tr>
					<td><s:property value="#st.index + 1"/></td>
					<td><s:property value="#task.tcontent"/></td>
					<td><s:property value="#task.tclass"/></td>
					<td><s:property value="#task.dname"/></td>
					<td>
						<s:if test="#task.tstate == 0">删除</s:if>
						<s:elseif test="#task.tstate == 1">待处理</s:elseif>
						<s:else>待办结</s:else>
					</td>
					<td><s:date name="#task.tdealtime" format="yyyy-MM-dd HH:mm:ss"/></td>
				</tr>
			</s:iterator>
		</table>
	</div>

	<!-- 一堆令人头疼的js!!!!!!!!!!!!!!!!!!!!!! -->
	<script type="text/javascript">
		BUI.use([ 'bui/overlay', 'bui/form' ], function(Overlay) {

			var dialogReturnTrans = new Overlay.Dialog({
				title : '确认框 ',
				width : 300,
				height : 200,
				bodyContent : '<p>是否确认回收  ？ </p>',
				success : function() {
					$("#form").action = "";
					$("#form").submit();
					this.close();
				}
			});
			$('#returnTrans').on('click', function() {
				dialogReturnTrans.show();
			});

			var dialogrResponseTrans = new Overlay.Dialog({
				title : '确认框 ',
				width : 300,
				height : 200,
				bodyContent : '<p>是否确认响应   ？ </p>',
				success : function() {
					$("#form").action = "";
					$("#form").submit();
					this.close();
				}
			});
			$('#responseTrans').on('click', function() {
				dialogrResponseTrans.show();
			});

			var dialogRefuseTrans = new Overlay.Dialog({
				title : '驳回意见',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#refuseTrans').on('click', function() {
				dialogRefuseTrans.show();
			});

			var dialogCommentTrans = new Overlay.Dialog({
				title : '发表意见',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#commentTrans').on('click', function() {
				dialogCommentTrans.show();
			});

			var dialogHandleTrans = new Overlay.Dialog({
				title : '确认框 ',
				width : 300,
				height : 200,
				bodyContent : '<p>是否确认处理   ？ </p>',
				success : function() {
					$("#form").action = "";
					$("#form").submit();
					this.close();
				}
			});
			$('#handleTrans').on('click', function() {
				dialogHandleTrans.show();
			});

			var dialogEndTrans = new Overlay.Dialog({
				title : '确认框 ',
				width : 300,
				height : 200,
				bodyContent : '<p>是否确认办结    ？ </p>',
				success : function() {
					$("#form").action = "";
					$("#form").submit();
					this.close();
				}
			});
			$('#endTrans').on('click', function() {
				dialogEndTrans.show();
			});

			var dialogMarkerTrans = new Overlay.Dialog({
				title : '批示',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#markerTrans').on('click', function() {
				dialogMarkerTrans.show();
			});

			var dialogPressTrans = new Overlay.Dialog({
				title : '催办',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#pressTrans').on('click', function() {
				dialogPressTrans.show();
			});

			var dialogDelayPost = new Overlay.Dialog({
				title : '延期申请',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#delayPost').on('click', function() {
				dialogDelayPost.show();
			});

			var dialogDelayJudge = new Overlay.Dialog({
				title : '延期审批',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'content',
				success : function() {
					$("#form").submit();
					this.close();
				}
			});
			$('#delayJudge').on('click', function() {
				dialogDelayJudge.show();
			});

			var dialogForwardPresident = new Overlay.Dialog({
				title : '确认框 ',
				width : 300,
				height : 200,
				bodyContent : '<p>是否确认提交行长    ？ </p>',
				success : function() {
					$("#form").action = "";
					$("#form").submit();
					this.close();
				}
			});
			$('#forwardPresident').on('click', function() {
				dialogForwardPresident.show();
			});

			var dialogForwardTrans = new Overlay.Dialog({
				title : '转发 ',
				width : 360,
				height : 280,
				//配置DOM容器的编号
				contentId : 'forward',
				success : function() {
					$("#forwardForm").submit();
					this.close();
				}
			});
			$('#forwardTrans').on('click', function() {
				dialogForwardTrans.show();
			});

		});
	</script>


	<!-- 驳回框 -->
	<!-- 此节点内部的内容会在弹出框内显示,默认隐藏此节点-->
	<div id="content" class="hidden" style="visibility: hidden;">
		<form id="form" class="form-horizontal" action="/" method="post">
			<div class="row">
				<div class="control-group span8">
					<div class="controls">
						<!--事务id-->
						<input name="tid" type="hidden" class="input-normal control-text">
					</div>
				</div>
				<div class="row">
					<div class="control-group span15">
						<div class="controls control-row4">
							<textarea class="input-large"></textarea>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>

	<!-- 此节点内部的内容会在弹出框内显示,默认隐藏此节点-->
	<div id="forward" class="hidden" style="visibility: hidden;">
		<form id="forwardForm" class="form-horizontal" action="/"
			method="post">
			<div class="row">
				<div class="control-group span8">
					<div class="controls">
						<!--事务id-->
						<input name="tid" type="hidden" class="input-normal control-text">
					</div>
				</div>
				<div class="row">
					<div class="control-group span15">
						<div class="controls control-row4">
							<select name="" style="width: 310px">
								<option value="-1" selected="selected">请选择</option>
								<option value="1">明细测试</option>
								<option value="2">明细测试2</option>
								<option value="3">明细测试3</option>
							</select>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
<body>
</html>
